<?php
/**
 * SocialEngine
 *
 * @category   Application_Extensions
 * @package    Album
 * @copyright  Copyright 2006-2010 Webligo Developments
 * @license    http://www.socialengine.net/license/
 * @version    $Id: view.tpl 9330 2011-09-27 23:33:35Z john $
 * @author     John Boehr <j@webligo.com>
 */
?>
<?php if($this->status):?>
<?php
  $this->headScript()
    ->appendFile($this->layout()->staticBaseUrl . 'externals/moolasso/Lasso.js')
    ->appendFile($this->layout()->staticBaseUrl . 'externals/moolasso/Lasso.Crop.js')
    ->appendFile($this->layout()->staticBaseUrl . 'externals/autocompleter/Observer.js')
    ->appendFile($this->layout()->staticBaseUrl . 'externals/autocompleter/Autocompleter.js')
    ->appendFile($this->layout()->staticBaseUrl . 'externals/autocompleter/Autocompleter.Local.js')
    ->appendFile($this->layout()->staticBaseUrl . 'externals/autocompleter/Autocompleter.Request.js')
    ->appendFile($this->layout()->staticBaseUrl . 'externals/tagger/tagger.js')
    ->appendFile($this->layout()->staticBaseUrl . 'application/modules/Ialbum/externals/scripts/core.js');
  $this->headTranslate(array(
    'Save', 'Cancel', 'delete',
  ));
?>
<style type="text/css">
	.lightface .nextImageAction{
		left: <?php echo $this->widthLeft - 50;?>px;
	}
    div.scrollKnob {
	background-color: #999;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}
div.scrollBar {
	width: 7px;
	position: absolute;
	background:#f2f2f2;
}
div.scrollBox {
	overflow: hidden;
	float: none !important;
	height: <?php echo $this->height - 20;?>px;
}
</style>
<script type="text/javascript">
function IsIE8Browser() {
    var rv = -1;
    var ua = navigator.userAgent;
    var re = new RegExp("Trident\/([0-9]{1,}[\.0-9]{0,})");
    if (re.exec(ua) != null) {
        rv = parseFloat(RegExp.$1);
    }
    return (rv == 4);
}

  en4.core.runonce.add(function() {
   	var nextHref = $('media_photo_next').get('class');   
    var keyupEvent = function(e) {
        if($$('.lightface')[0]){
	        if( e.key == 'right' ) {
	           	if($('photo_next')){
	         		boxNextPhoto($('photo_next').get('href'));
	         	}else{
	         		boxNextPhoto(nextHref);
	            }
	        } else if( e.key == 'left' ) {
	        	if($('photo_prev')){
	        		boxNextPhoto($('photo_prev').get('href'));
	        	}else{
	        		boxNextPhoto(nextHref);
	            }
	        }
      	}
    }
	$$('html').removeEvent('keyup').addEvent('keyup', keyupEvent);
	if($('prevImageAction')) $('prevImageAction').removeEvent('click').addEvent('click', function(){
		if($('photo_prev')){
    		boxNextPhoto($('photo_prev').get('href'));
    	}else{
    		boxNextPhoto(nextHref);
        }
	});
	if($('nextImageAction')) $('nextImageAction').removeEvent('click').addEvent('click', function(){
		if($('photo_next')){
    		boxNextPhoto($('photo_next').get('href'));
    	}else{
    		boxNextPhoto(nextHref);
        }
	});
	$$('.imageActionSwitch').each(function(el){
		$(el).addEvents({
			mousemove : function(e){
				e.stop();
				$('boxBottomUnderImage').show();
				if($$('.imageActionSwitch')) $$('.imageActionSwitch').setStyle('opacity', 0.5);
				
				$(this).addClass('hightlight');
				//todo
			},
			mouseout: function(e){
				e.stop();
				$('boxBottomUnderImage').hide();
				if($$('.imageActionSwitch')) $$('.imageActionSwitch').setStyle('opacity', 0);
				
				$(this).removeClass('hightlight');
				//todo
			}
		});	
	});
	$('boxBottomUnderImage').addEvents({
		mouseenter : function(){
			$('boxBottomUnderImage').show();
			if($$('.imageActionSwitch')) $$('.imageActionSwitch').setStyle('opacity', 0.5);
		}
	});	
	//add Event hover on image to show navagator and some infos
	$('tbl_leftCol').addEvents({
		   mouseenter : function(e){
			   e.stop();
				//if not tagged action
			   if(!$('lassoMask')){
					$('boxBottomUnderImage').show();
					if($$('.imageActionSwitch')) $$('.imageActionSwitch').setStyle('opacity', 0.5);				
				//todo
			   }
			},
			mouseleave: function(e){
				e.stop();
				$('boxBottomUnderImage').hide();
				if($$('.imageActionSwitch')) $$('.imageActionSwitch').setStyle('opacity', 0);
				//todo
			}
	});	
	//add evnet click for left table holder
	$('tbl_leftCol').addEvent('click', function(){
		if(!en4.ialbum.isOtherClick)
		 boxNextPhoto(nextHref); 
	});
	//toggle top menuActions 
	$('actionSettings').addEvent('click', function(event){
		 if($(this).hasClass('active')){
			 $(this).removeClass('active');
			 //enable box menu actions
			 $('selectorMenu').hide();
		 }else{
			 $(this).addClass('active');
			 //disable menuaction
			 $('selectorMenu').show();
		 }
	 });
	
    // Add shutdown handler
    en4.core.shutdown.add(function() {
      window.removeEvent('keyup', keyupEvent);
    });

    //scroll bar
    $$('.scrollBox').each(function(el) {	
		var s = new ScrollBar(el, {
			autoHide: el.hasClass('autoHide'),
			minKnobDimensions: 10
		});
		if (el.get('rel')) s.set(el.get('rel'));
	});
  });
</script>
<table class="tbl_lightbox" style="width:<?php echo $this->width?>px;height:<?php echo $this->height?>px;" width="<?php echo $this->width?>" height="<?php echo $this->height?>">
	<tr>
		<td id="tbl_leftCol" class="tbl_leftCol" height="<?php echo $this->height?>" width="<?php echo $this->widthLeft?>" style="height:<?php echo $this->height?>px; width:<?php echo $this->widthLeft?>px;">
	     <div id="innerLeftCol" class="innerLeftCol" style="height:<?php echo $this->height?>px; width:<?php echo $this->widthLeft?>px;/*line-height:<?php echo $this->height/13.4; ?>em;*/ overflow-y:auto; overflow-x: auto;">
		    		      <?php
				$url = $this->baseUrl.$this->photo->getPhotoUrl();
				$url = getFixPhotoURL($url);
				$host =  $_SERVER['HTTP_HOST'];
				$t_host = 'http://';
				list($width, $height, $type, $attr) = getimagesize($t_host.$host.'/'.$url);
				$style = '';
				if($height && $height < $this->height)
					$style = 'margin-top:'.($this->height - $height)/2 .'px;';
				?>
		    <!--<div class='albums_viewmedia_info'> -->
			<div class='album_viewmedia_container' id='media_photo_div' style='<?php echo $style;?>'>
			      <a id='media_photo_next'  class="<?php echo $this->nextPhoto ? $this->escape($this->nextPhoto->getHref()) : '#' ?>" href='javascript:void(0);'>
			        <?php echo $this->htmlImage($this->photo->getPhotoUrl(), $this->photo->getTitle(), array('id' => 'media_photo'/*, 'style' => 'max-width:'. $this->widthLeft .'px;max-height:'. $this->height .'px;'*/)
			        ); ?>
	      		</a>
	    	</div>
	     <!-- </div> -->
    	
		</div>
		</td>		
		<td class="tbl_rightCol" width="<?php echo $this->width - $this->widthLeft?>" valign="top">
			<!-- box action -->
		 <div class="boxAction" style="">
					<a class="actionSettings" id="actionSettings" href="javascript:void(0);">							
					</a>
					<div class="selectorMenu" id="selectorMenu">
						<div class="menu">
							<ul class="menuInner">
							<?php if ($this->viewer()->getIdentity()):?>
							<?php if( $this->canEdit ): ?>
								<li class="menuItem">
									<a href="javascript:void(0);" onclick="en4.ialbum.rotate(<?php echo $this->photo->getIdentity() ?>, 90, '<?php echo $this->photo->getHref()?>');" class="itemAnchor">
										<span class="itemLabel fsm"><?php echo $this->translate('Rotate Left')?></span>
									</a>
								</li>
								<li class="menuItem">
									<a href="javascript:void(0);" onclick="en4.ialbum.rotate(<?php echo $this->photo->getIdentity() ?>, 270, '<?php echo $this->photo->getHref()?>');" class="itemAnchor">
										<span class="itemLabel"><?php echo $this->translate('Rotate Right')?></span>
									</a>
								</li>
								<li class="menuItem">
									<a href="javascript:void(0);" onclick="en4.ialbum.flip(<?php echo $this->photo->getIdentity() ?>, 'horizontal', '<?php echo $this->photo->getHref()?>');" class="itemAnchor">
										<span class="itemLabel fsm"><?php echo $this->translate('Flip Horizontal')?></span>
									</a>
								</li>
								<li class="menuItem">
									<a href="javascript:void(0);" onclick="en4.ialbum.flip(<?php echo $this->photo->getIdentity() ?>, 'vertical', '<?php echo $this->photo->getHref()?>');" class="itemAnchor">
										<span class="itemLabel"><?php echo $this->translate('Flip Vertical')?></span>
									</a>
								</li>
								<li class="uiMenuSeparator"></li>
							<?php endif;?>
							<?php endif;?>	
								<li class="menuItem">								
									<a href="<?php echo $this->url(array('module'=>'ialbum', 'controller'=>'index', 'action'=>'download-image', 'photo_id'=>$this->photo->getIdentity()), 'default', true);?>" class="itemAnchor">
										<span class="itemLabel fsm"><?php echo $this->translate('Download')?></span>
									</a>
								</li>
								<?php if ($this->viewer()->getIdentity()):?>
								<?php if( !$this->message_view ):?>
									<li class="menuItem">
										<?php echo $this->htmlLink(array('route' => 'user_extended', 'controller' => 'edit', 'action' => 'external-photo', 'photo' => $this->photo->getGuid(), 'format' => 'smoothbox'), '<span class="itemLabel">'. $this->translate("Make Profile Picure") .'</span>', array('class' => 'smoothbox itemAnchor')) ?>
									</li>
									<li class="menuItem">							
	        							<?php echo $this->htmlLink(Array('module'=> 'core', 'controller' => 'report', 'action' => 'create', 'route' => 'default', 'subject' => $this->photo->getGuid(), 'format' => 'smoothbox'),'<span class="itemLabel">'. $this->translate("Report This Photo") .'</span>', array('class' => 'smoothbox itemAnchor')); ?>									
									</li>
								<?php endif;?>
								<?php if( $this->canDelete ): ?>
									<li class="menuItem">
										<?php echo $this->htmlLink(array('reset' => false, 'action' => 'delete'), '<span class="itemLabel">'.$this->translate('Delete This Photo') .'</span>', array('class' => 'smoothbox itemAnchor')) ?>
									</li>
								<?php endif;?>
								<?php endif;?>
							</ul>
						</div>
					</div>
				</div>
			<!-- end box action -->
			<div id="boundRightCol" style="height:<?php echo $this->height - 20;?>px;position: relative;">
				<div class="scrollBox autoHide" style="height: <?php echo $this->height - 20;?>px;">
				<!-- box infos -->
					<?php echo $this->action("infos", "photo", "ialbum", array("album_id"=> $this->album->getIdentity(), "photo_id"=>$this->photo->getIdentity())) ?>	
				<!--  end infos -->	
				<!-- <br> -->
				<br>								
				<!-- comment like -->
					<?php echo $this->action("list-light", "comment", "ialbum", array("type"=>"album_photo", "id"=>$this->photo->getIdentity())) ?>	
				<!-- end comment like -->
				</div>						   
			</div>
		</td>
	</tr>
</table>

<div id="boxBottomUnderImage" class="boxBottomUnderImage" style="width:<?php echo $this->widthLeft;?>px;">

			<!-- check like permission -->
			<?php if( $this->viewer()->getIdentity() && $this->canComment ): ?>
			  <?php if( $this->subject()->likes()->isLike($this->viewer()) ): $class="actions_unlike"; ?>
			  <?php else: $class="actions_like"?>
			  <?php endif; ?>			
			<div id="like_actions" class="<?php echo $class?>">				        	
				<a class="fbPhotosPhotoActionsTag" href="javascript:void(0)" onclick="javascript:en4.ialbum.isOtherClick=true;en4.ialbum.comments.lightbox.unlike('<?php echo $this->subject()->getType()?>', '<?php echo $this->subject()->getIdentity() ?>');"> 
					<span class="uiIconText">
						<img width="11" height="15" alt="" src="application/modules/Ialbum/externals/images/like.png" class="img">
						<?php echo $this->translate('Unlike This') ?>
					</span>
				</a>
				<a class="fbPhotosPhotoActionsTag" href="javascript:void(0)" onclick="javascript:en4.ialbum.isOtherClick=true;en4.ialbum.comments.lightbox.like('<?php echo $this->subject()->getType()?>', '<?php echo $this->subject()->getIdentity() ?>');"> 
					<span class="uiIconText">
						<img width="11" height="15" alt="" src="application/modules/Ialbum/externals/images/like.png" class="img">
						<?php echo $this->translate('Like This') ?>
					</span>
				</a> 
			</div>
			<?php endif; ?>
			
			<!-- album infos -->
			<div class="td_albuminfos">  
				<?php echo $this->htmlLink($this->album, $this->album->getTitle(), array(
					'class' => 'album_title'
				));?>
				 &mdash;
				 <span class="navigator_number">
				 <?php 
					  echo $this->translate('%1$s of %2$s',
					  $this->locale()->toNumber($this->photo->getPhotoIndex() + 1),
					  $this->locale()->toNumber($this->album->count())) 
				  ?>
				  </span>		
			</div>
				 
			<!--  tag -->  
			<?php if( $this->canTag ): ?>
			<div class="actions_tags"> <?php //echo $this->htmlLink('javascript:void(0);', $this->translate('Add Tag'), array('onclick'=>'taggerInstance.begin();')) ?>
				<a class="fbPhotosPhotoActionsTag" href="javascript:void(0)" onclick="javascript:en4.ialbum.isOtherClick = true;taggerInstance.begin();"> 
					<span class="uiIconText">
						<img width="11" height="15" style="top: -1px;" alt="" src="application/modules/Ialbum/externals/images/tag.png" class="img">
						<?php echo $this->translate('Tag Photo')?>
					</span>
				</a>			        		
			</div>			
			<?php endif; ?>	
    	</div>
    	<?php if( $this->album->count() > 1 ): ?>
	    	<a style="line-height:<?php echo $this->height/13.403; ?>em;" id="prevImageAction" title="<?php echo $this->translate('Previous')?>" class="prevImageAction imageActionSwitch"><i></i></a>
	    	<a style="line-height:<?php echo $this->height/13.403; ?>em;left: <?php echo $this->widthLeft - 50;?>px;" id="nextImageAction" title="<?php echo $this->translate('Next')?>" class="nextImageAction imageActionSwitch"><i></i></a>	
		<?php endif;?>

<span id="heightTable" class="<?php echo $this->height?>" style="display: none;"></span>
<?php if( $this->album->count() > 1 ): ?>
			    <div style="display:none;">
			      <?php echo $this->htmlLink(( $this->previousPhoto ? $this->previousPhoto->getHref() : null ), $this->translate('Prev'), array('id' => 'photo_prev')) ?>
			      <?php echo $this->htmlLink(( $this->nextPhoto ? $this->nextPhoto->getHref() : null ), $this->translate('Next'), array('id' => 'photo_next')) ?>
			    </div>
<?php endif ?>

<?php else:?>
	<style type="text/css">
		.box_navigator1	a:hover{
			color: #333743;
		}	    
    </style>
	<div id="leftCol" class="leftColContent" style="width: 740px; height: 619px; background-color: rgb(17, 17, 17); text-align: center; cursor: pointer; display: block; font-size: 0px; vertical-align: middle;">
		<div id="lightbox_error" style="width: 500px; background-color: #FFFFFF; border-radius: 5px;text-align: center;color: #000000;vertical-align: middle;position: absolute; top: <?php echo 569/2?>px; left: 120px; padding: 10px;">
		 	<p><?php echo $this->translate($this->message);?></p>
		 	<div class="box_navigator1" style="font-size: 11px; text-align: center;">
			 	<a href="<?php echo $this->baseUrl()?>"><?php echo $this->translate('Go home');?></a>
			 	<?php if( $this->album &&  $this->album->count() > 1 ): ?>
			 	. <a href="javascript: void(0);" onClick="boxNextPhoto('<?php echo $this->previousPhoto ? $this->previousPhoto->getHref() : null;?>');$('lightbox_error').hide();"><?php echo $this->translate('Previous photo');?></a>
			 	. <a href="javascript: void(0);" onClick="boxNextPhoto('<?php echo $this->nextPhoto ? $this->nextPhoto->getHref() : null;?>');$('lightbox_error').hide();"><?php echo $this->translate('Next photo');?></a>
			 	<?php endif;?>
			</div>
		 </div>
	</div>
		
<?php endif;?> 
<?php 
function getFixPhotoURL($url) {
	$po = strpos($url, '?');
	if ($po!==FALSE) {
		$url = substr($url, 0, $po);
	}
	return $url;
}
?>